widgets.brease.Table

Widget Description

short: Darstellung von Daten in einer Tabelle
de: Darstellung von Daten in einer Tabelle
en: Displays data in a table

Properties

name description category type defaultValue bindable readOnly required localizable editableBinding projectable cssProp (has no setter and getter in JS) groupRefId groupOrder nodeRefId (for linking node and value) deprecated typeRefId (for StyleReference) subtype (for MpComIdentReference)
busyIndicatorDelay delay time for busy indicator [ms] Behavior Integer 0 false false false false false true
columnWidth Width of columns. Appearance Size 100 false false false false false true CellSize 2
dataOrientation A dataset is either placed horizontally or vertically. Behavior brease.enum.Direction vertical false false false false false true
ellipsis If true, overflow of text is symbolized with an ellipsis. This option has no effect, if wordWrap = true. Behavior Boolean false false false false false false true
enable Initial option to enable widget. Behavior Boolean true true false false false false true
filterConfiguration Configuration for filtering entires in the table Data String true false false false false true
headerSize Height of rows. Appearance UInteger 0 false false false false false true
initRefreshRate Refresh rate of the rebuild of the table, at init and changes for properties. Needs to be increased the more items are used but also at the rate of which properties are updated. Behavior UInteger 0 false false false false false true
maxHeight Maximum height the Table can grow, when not set to zero Appearance Integer 0 false false false false false true
multiLine If true, more than one line is possible. Text will wrap when necessary (wordWrap=true) or at line breaks (\n). If false, text will never wrap to the next line. The text continues on the same line. Behavior Boolean false false false false false false true
offsetColumn Index of first viewed column entry. Behavior Integer 0 true false false false false false
offsetRow Index of first viewed row entry. Behavior Integer 0 true false false false false false
permissionOperate restricts operability to users, which have given roles Accessibility RoleCollection no defaultValue
defined
false false false false false true
permissionView restricts visibility to users, which have given roles Accessibility RoleCollection no defaultValue
defined
false false false false false true
refreshRate Refresh rate of how often continuously updated variables are shown in the table. Recommanded values for the T50: 1000 cells: 1000 ms (with stopRefreshAtScroll = true) 500 cells: 700 ms (with stopRefreshAtScroll = true) 500 cells: 1000 ms (with stopRefreshAtScroll = false) <250 cells: 400 ms (with stopRefreshAtScroll = true) Behavior UInteger 600 false false false false false true
rowHeight Height of rows. Appearance Size 30 false false false false false true CellSize 1
scrollLinkXRefId Reference to a second Table widget that should be synchronized for horizontal scrolling Behavior WidgetReference false false false false false true ScrollSynchronization
scrollLinkYRefId Reference to a second Table widget that should be synchronized for vertical scrolling Behavior WidgetReference false false false false false true ScrollSynchronization
selectedColumn Index of selected column. Data Integer 0 true false false false false true
selectedRow Index of selected row. Data Integer 0 true false false false false true
selection If true, the user can select data entries. Behavior Boolean true false false false false false true
showHeader Show/Hide header Appearance Boolean true false false false false false true
showScrollbars Show/Hide scrollbars Behavior Boolean true false false false false false true
showSortingButton If true, by clicking on a columns header will be availabe. The table will only sort on the currently selected header. The header can be sorted in descending order (one click), ascending order (one more click) or returned to normal state (one more click); given that you started in normal state. Behavior Boolean false false false false false false true
stopRefreshAtScroll If set to true this parameter will stop the table from continuously updating the table while scrolling. This makes for a better user experience, especially in the T50 and low end targets where it takes some time to reinstantiate all DOM elements - which will interrupt the scrolling. Behavior Boolean false false false false false false true
style reference to a style for this widget type Appearance StyleReference default true false false false false true
tabIndex sets if a widget should have autofocus enabled (0), the order of the focus (>0), or if autofocus should be disabled (-1) Behavior Integer -1 false false false false false true
tableConfiguration Configuration for the visibility and/or disabling of table rows and columns. Use it like: Visible: "{ 'specRows': [ {'index':0,'visible': true}, {'index':2,'visible': false}, {'index':4,'visible': true} ], 'specColumns': [ {'index':5, 'visible': true}, {'index':8, 'visible': false}, {'index':10,'visible': true} ] }" Disable: "{ 'specRows': [ {'index':0,'disable': true}, {'index':2,'disable': false}, {'index':4,'disable': true} ], 'specColumns': [ {'index':5, 'disable': true}, {'index':8, 'disable': false}, {'index':10,'disable': true} ] }" Both: "{ 'specRows': [ {'index':0,'visible': true, 'disable': true}, {'index':2,'visible': true,'disable': false}, {'index':4,'visible': false, 'disable': true} ], 'specColumns': [ {'index':5, 'visible': true, 'disable': true}, {'index':8, 'visible': true, 'disable': false}, {'index':10,'visible': false, 'disable': true} ] }" Data String true false false false false false
tooltip reference to a tooltip for a widget Appearance String false false false true false true
useTableStyling If false, styling can be set on the individual columns on their repsective TableItem/TableItemImageList. Appearance Boolean true false false false false false true
visible change visibility Behavior Boolean true true false false false false true
wordWrap If true, text will wrap when necessary. Behavior Boolean false false false false false false true
zIndex The zIndex property specifies the z-order of a widget and its childs.
When widgets overlap, z-order determines which one covers the other. A widget with a larger zIndex generally covers a widget with a lower one.
The zIndex must be unique within a content.
UInteger no defaultValue
defined
false false true true true
left absolute position measured from left boundary of parent container Integer no defaultValue
defined
false false false true true
top absolute position measured from top boundary of parent container Integer no defaultValue
defined
false false false true true
height outer height of widget Size 300 false false false true true
width outer width of widget Size 400 false false false true true

Styleable Properties

name type description defaultValue
activeBackColor Color

Backcolor for selected table entries

#FF8800
activeBackGroundGradient Gradient

Background gradient for selected table entries

mouseDownTextColor Color

Text color for selected entries

transparent
mouseDownBackColor Color

Backcolor for mouse down event on table entries

transparent
mouseDownBackGroundGradient Gradient

Backcolor for mouse down event on table entries

activeInputCellTextColor Color

Sets the color of the text in the cell while writing in

#333333
activeInputCellInnerShadow Shadow

Hint: you can also use this property as inner border: e.g. "0 0 0 5px #B5B5B5"

none
activeInputCellBackColor Color

Backcolor for even table entries in column direction

#FFFFFF
activeInputCellBackgroundGradient Gradient

Background gradient for input cells.

inputCellTextColor Color

Sets the text color displayed in the cell while writing in

#333333
inputCellInnerShadow Shadow

Hint: you can also use this property as inner border: e.g. "0 0 0 5px #B5B5B5"

none
inputCellBackColor Color

Backcolor for even table entries in column direction

#FFFFFF
inputCellBackgroundGradient Gradient

Background gradient for input cells.

activeTextColor Color

Text color for selected entries

#FFFFFF
backColor Color

Sets the background color of the table

transparent
backColorEvenColumn Color

Backcolor for even table entries in column direction

#EAEAEA
backColorOddColumn Color

Backcolor for odd table entries in column direction

#FCFCFC
backGroundGradientEvenColumn Gradient

Background as a gradient for even table entries in column direction

backGroundGradientOddColumn Gradient

Background as a gradient for even table entries in column direction

backColorEvenRow Color

Backcolor for even table entries in row direction

#FFFFFF
backColorOddRow Color

Backcolor for odd table entries in row direction

#FCFCFC
backGroundGradientEvenRow Gradient

Background as a gradient for even table entries in row direction

backGroundGradientOddRow Gradient

Background as a gradient for even table entries in row direction

backGroundGradient Gradient

Background as a gradient

borderColor Color

Sets the border color of the widget. For further information, please see its type

#C8C8C8
borderStyle BorderStyle

Style of the Border of the widget

none
borderWidth PixelValCollection

Sets the border width of the widget. For further information, please see its type

0px
cellAlign brease.enum.BackgroundPosition

Alignment of the text in a cell

center center
cellBorderStyle BorderStyle

Style of the cell borders

solid
cellBorderColor Color

Sets the border color of each cell. For further information, please see its type

#C8C8C8
cellBorderWidth PixelValCollection

Sets the border width of each cell. For further information, please see its type

0px 0px 1px 1px
cellPadding Padding

Padding of table cells.

0px
headerCellPadding Padding

Padding of the header cells.

0px
cornerRadius PixelValCollection

Sets the radius of the widget rounded corners. For further information, please see its type

0px
disabledActiveTextColor Color

Text color for selected entries

#FFFFFF
disabledActiveBackColor Color

Backcolor for selected table entries

#C7C7C7
disabledActiveBackGroundGradient Gradient

Background gradient for selected table entries

disabledBackColor Color

Sets the background color of the widget when disabled

transparent
disabledBackGroundGradient Gradient

Background as a gradient

disabledBackColorEvenRow Color

Backcolor for even table entries in row direction

#EAEAEA
disabledBackColorOddRow Color

Backcolor for odd table entries in row direction

#FFFFFF
disabledBackColorEvenColumn Color

Backcolor for even table entries in column direction

#EAEAEA
disabledBackColorOddColumn Color

Backcolor for odd table entries in column direction

#FFFFFF
disabledBorderColor Color

Sets the border color of the widget when disabled. For further information, please see its type

#C8C8C8
disabledCellBorderColor Color

Sets the border color of each cell when disabled. For further information, please see its type

#C8C8C8
disabledItemBorderColor Color

Border color of a disabled item (can be row or column - depends on the configuration)

#C8C8C8
disabledHeaderTextColor Color

Sets the header text color when the widget is disabled

#C8C8C8
disabledHeaderBackColor Color

Text color for selected entries

#FCFCFC
disabledHeaderGradient Gradient

Background gradient for table header

disabledTextColor Color

Sets the text color when the widget is disabled

#C8C8C8
fontName FontName

Fontname of the text

Arial
fontSize PixelVal

Fontsize of the header text

14px
headerBackColor Color

Text color for selected entries

#FCFCFC
headerGradient Gradient

Background gradient for table header

headerTextColor Color

Sets the header text color

#333333
headerFontSize PixelVal

Fontsize of the header text

14px
sortingButtonColor Color

Color of the arrow that is not the sorted way

#ececec
sortingButtonActiveColor Color

Color of the arrow that is the sorted way

#5f8dd3
textColor Color

Sets the text color

#333333
bold Boolean

If true font style is bold

false
italic Boolean

If true font style is italic

false
opacity Opacity

Opacity of the widget

1
shadow Shadow

Shadow of the Widget

none

Events

name description arguments
Click Fired when element is clicked on.
  • origin: String

    id of widget that triggered this event

  • horizontalPos: String

    horizontal position of click in pixel i.e '10px'

  • verticalPos: String

    vertical position of click in pixel i.e '10px'

DisabledClick Fired when disabled element is clicked on.
  • origin: String

    id of widget that triggered this event

  • hasPermission: Boolean

    defines if the state is caused due to missing roles of the current user

  • horizontalPos: String

    horizontal position of click in pixel i.e '10px'

  • verticalPos: String

    vertical position of click in pixel i.e '10px'

EnableChanged Fired when operability of the widget changes.
  • value: Boolean

    operability

FocusIn Fired when the widgets gets focus
FocusOut Fired when the widgets lost focus
ValueChanged Triggered when any value in the table is changed
VisibleChanged Fired when the visibility of the widget changes.
  • value: Boolean

    visibility

Actions

name description arguments result
Focus Sets focus on the widget element, if it can be focused and keyboardOperation=true
OpenConfiguration Open the filter part of the configuration dialogue
  • type: TableConfigurationType

    (Supported types: Filtering)

ScrollPageDown Scroll one page down
ScrollPageLeft Scroll one page left
ScrollPageRight Scroll one page right
ScrollPageUp Scroll one page up
ScrollStepDown Scroll one step down
ScrollStepLeft Scroll one step left
ScrollStepRight Scroll one step right
ScrollStepUp Scroll one step up
ScrollToHorizontal Scroll to horizontal column
  • value: UInteger

ScrollToVertical Scroll to vertical row
  • value: UInteger

SetColumnVisibility Set the visibility for a certain column.
  • index: Integer

  • visible: Boolean

SetEnable Sets the state of property «enable»
  • value: Boolean

SetRowVisibility Set the visibility for a certain row.
  • index: Integer

  • visible: Boolean

SetSelectedColumn Sets selectedColumn
  • value: Integer

SetSelectedRow Sets selectedRow
  • value: Integer

SetStyle This function sets the style of the widget by calling the superclass and then processing this in the widget.
  • value: StyleReference

SetVisible Sets the state of property «visible»
  • value: Boolean

ShowTooltip